<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="utf-8">
<title>商家列表</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<link rel="stylesheet" type="text/css" th:href="@{/plugin/layui/css/layui.css}" />
	<script type="text/jscript" th:src="@{/plugin/layui/layui.js}" charset="UTF-8"></script>
	<script type="text/jscript" th:src="@{/plugin/jquery/jquery.min.js}"></script>
</head>
<body>
	<div class="site-text" style="margin: 5%; display: none" id="window"  target="test123">	
	<form class="layui-form" id="book" method="post" lay-filter="example">
	  <div class="layui-form-item">
	    <label class="layui-form-label">账号</label>
	    <div class="layui-input-block">
	      <input type="text" id="user_id" name="user_id"  lay-verify="title" autocomplete="off" placeholder="请输入账号" class="layui-input">
	    </div>
	  </div>
	  <div class="layui-form-item">
	    <label class="layui-form-label">密码</label>
	    <div class="layui-input-block">
	      <input type="password" id="password" name="password" lay-verify="title" autocomplete="off" placeholder="请输入密码" class="layui-input">
	    </div>
	  </div>
	  <div class="layui-form-item">
	    <label class="layui-form-label">商家码</label>
	    <div class="layui-input-block">
	      <input type="text" id="store_key" name="store_key" lay-verify="title" autocomplete="off" placeholder="请输入商家码" class="layui-input">
	    </div>
	  </div>
	  
	 
	 <!--  <div class="layui-form-item">
	    <div class="layui-input-block">
	      <button class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
	    </div>
	  </div> -->
	</form>
</div>




<div class="site-text" style="margin: 5%; display: none" id="window02"  target="test123">	
	<form class="layui-form" id="book" method="post" lay-filter="example">
	  <div class="layui-form-item">
	    <label class="layui-form-label">原来的密码</label>
	    <div class="layui-input-block">
	      <input type="text" id="password_old" name="password_old"  lay-verify="title" autocomplete="off" placeholder="请输入原来的密码" class="layui-input">
	    </div>
	  </div>
	  <div class="layui-form-item">
	    <label class="layui-form-label">新密码</label>
	    <div class="layui-input-block">
	      <input type="text" id="password_new" name="password_new"  lay-verify="title" autocomplete="off" placeholder="请输入新密码" class="layui-input">
	    </div>
	  </div>
	</form>
</div>


<div class="site-text" style="margin: 5%; display: none" id="window03"  target="test123">	
	<form class="layui-form" id="book" method="post" lay-filter="example">
	  <div class="layui-form-item">
	    <label class="layui-form-label">商家码</label>
	    <div class="layui-input-block">
	      <input type="text" id="store_key_delete" name="store_key" lay-verify="title" autocomplete="off" placeholder="请输入商家码" class="layui-input">
	    </div>
	  </div>
	</form>
</div>
	<table class="layui-hide" id="demo" lay-filter="test"></table>
	<script type="text/html" id="barDemo" >
  		<a class="layui-btn layui-btn-xs" lay-event="edit">修改密码</a>
  		<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script id="toolbarDemo" type="text/html">
 	 <div class="layui-btn-container">
    	<button class="layui-btn layui-btn-sm" lay-event="add">新建账号</button>
 	 </div>
	</script>
	<script type="text/javascript"  th:inline="none">
	layui.use(['laydate', 'laypage', 'layer', 'table', 'upload', 'element','form'], function(){
		  var laydate = layui.laydate //日期
		  ,laypage = layui.laypage //分页
		  ,layer = layui.layer //弹层
		  ,table = layui.table //表格
		  ,upload = layui.upload //上传
		  ,element = layui.element //元素操作
		  ,form = layui.form
		  ,$=layui.$;
		  
		  //监听Tab切换
		  element.on('tab(demo)', function(data){
		    layer.tips('切换了 '+ data.index +'：'+ this.innerHTML, this, {
		      tips: 1
		    });
		  });
		  
	//table
	 table.render({
		    elem: '#demo'
		    ,height: 420
		    ,url: 'selectAllUsers' //数据接口
		    ,title: '用户表'
		    ,page: true //开启分页
		    ,toolbar: '#toolbarDemo'  //开启工具栏，此处显示默认图标，可以自定义模板，详见文档
		    ,cols: [[ //表头
		      {type: 'checkbox', fixed: 'left'}
		      ,{field: 'user_id', title: '账号', width:100, sort: true, fixed: 'left'}
		      ,{field: 'last_Login_Time', title: '上次登陆时间', width: 500, sort: true}
		      ,{fixed: 'right', width: 400, align:'center', toolbar: '#barDemo'}
		    ]]
		  });
		layui.use('table', function() {
			var table = layui.table;

		});
		
		 //监听头工具栏事件
		  table.on('toolbar(test)', function(obj){
		    var checkStatus = table.checkStatus(obj.config.id)
		    ,data = checkStatus.data; //获取选中的数据
		    switch(obj.event){
		      case 'add':
		        layer.open({
		        	type: 1 
		               ,title: ['新增用户']
		               ,btn: ['确定', '取消'] 
		               ,shadeClose: true
		               ,shade: 0 
		               ,maxmin: true 
		               ,content: $("#window")
		               ,yes:function(index,layero){
		            	   $.getJSON("/store/user/regist",{
		            		   user_id: $('#user_id').val(),
		            		   password: $('#password').val(),
		               		store_key: $('#store_key').val()
		            	   },function(data){
		            		  if(data.code==0){
		            			  layer.alert(data.msg);
		            			  layer.close(index);
		            			  location.reload();
		            		  }else{
		            			  layer.alert(data.msg);
		            		  }
		            	   })
		               }
		        });
		      break;
		    
		    };
		  });
		  
		  //监听行工具事件
		  table.on('tool(test)', function(obj){ //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
		    var data = obj.data //获得当前行数据
		    ,layEvent = obj.event; //获得 lay-event 对应的值
		    if(layEvent === 'del'){
		      layer.confirm('警告!,您真正执行删除用户操作,要继续吗', function(index){
		    	  layer.open({
			        	type: 1 
			               ,title: ['删除用户']
			               ,btn: ['确定', '取消'] 
			               ,shadeClose: true
			               ,shade: 0 
			               ,maxmin: true 
			               ,content: $("#window03")
			               ,yes:function(index,layero){
			            	   $.getJSON("/store/user/deleteUser",{
			            		   user_id: data.user_id,
			            		   store_key: $('#store_key_delete').val()
			            	   },function(data){
			            		   console.log(data);
			            		  if(data.code==0){
			            			  alert(data.msg);
			            			  layer.close(index);
			            			  layer.close(index);
			            			  location.reload();
			            		  }else{
			            			  layer.alert(data.msg);
			            		  }
			            	   })
			               }
			        }); 
		      });
		    } else if(layEvent === 'edit'){
		    	console.log(data);
		    	layer.open({
		        	type: 1 
		               ,title: ['修改'+data.user_id+'的密码']
		               ,btn: ['确定', '取消'] 
		               ,shadeClose: true
		               ,shade: 0 
		               ,maxmin: true 
		               ,content: $("#window02")
		               ,yes:function(index,layero){
		            	   $.getJSON("/store/user/updatePassword",{
		            		   user_id: data.user_id,
		            		   password_old: $('#password_old').val(),
		               		  password_new: $('#password_new').val()
		            	   },function(data){
		            		  if(data.code==0){
		            			  layer.alert(data.msg);
		            			  layer.close(index);
		            		  }else{
		            			  layer.alert(data.msg);
		            		  }
		            	   })
		               }
		        });
		    }
		  });
	});
	</script>
</body>
</html>